<template>

  <div>
    <!--页头导航栏-->
    <nav class="navbar navbar-default navbar-fixed-top header">
      <div class="container">
        <div class="navbar-header">
          <button
            type="button"
            class="navbar-toggle collapsed"
          >
            <span class="sr-only">实验楼</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a
            class="navbar-brand"
            href="/"
          >
            <img src="/static/img/logo_03.png">
          </a>
        </div>
        <div
          class="collapse navbar-collapse"
          id="header-navbar-collapse"
        >


          <!--课程/路径/讨论区/训练营/会员 导航链接-->
          <ul class="nav navbar-nav">
            <li class="dropdown ">
              <a
                href="/#/courses"
                class="dropdown-toggle"
                data-toggle="dropdown"
              >
                课程
                <span class="caret"></span>
              </a>
              <ul class="dropdown-menu">
                <li><a
                    class=""
                    href="/#/courses"
                  >全部课程</a></li>
                <li><a
                    class=""
                    href="/#/courses"
                  >即将上线</a></li>
                <li><a
                    class=""
                    href="/#/courses"
                  >开发者</a></li>
              </ul>
            </li>
            <li class="">
              <a href="/#/paths">路径</a>
            </li>
            <li class="">
              <a href="/#/questions">讨论区</a>
            </li>
            <li class=" bootcamp new-nav logo-1111">
              <a href="/#/bootcamp">训练营</a>

            </li>
            <li class=" new-nav logo-1111">
              <a href="/#/vip">会员</a>

            </li>

          </ul>


          <div class="navbar-right btns">
            <!--如果用户已经登录，显示用户信息-->
            <div v-if='login_username'>
              <a
                class="btn btn-default navbar-btn sign-in"
                data-sign="signin"
                data-toggle="modal"
                href='/user'
              >消息</a>
              <a
                class="btn btn-default navbar-btn sign-in"
                data-sign="signin"
                data-toggle="modal"
                href='/user'
              >{{ login_username }}</a>
              <a
                class="btn btn-default navbar-btn sign-up"
                data-sign="signup"
                data-toggle="modal"
                @click="logout"
              >注销</a>
            </div>

            <!--如果没有登录显示 登录/注册按钮-->
            <div v-else>
              <a
                class="btn btn-default navbar-btn sign-in"
                data-sign="signin"
                data-toggle="modal"
                @click="change_login"
              >登录</a>
              <a
                class="btn btn-default navbar-btn sign-up"
                data-sign="signup"
                data-toggle="modal"
                @click="change_regist"
              >注册</a>
            </div>
          </div>

          <!--搜索框-->
          <form
            class="navbar-form navbar-right"
            action="search"
            method="get"
            role="search"
          >navbar-right btns
            <div class="form-group">
              <Search
                @search="search"
                v-model="keyword"
                v-width="300"
                showSearchButton
                placeholder="搜索 课程/问答"
              ><i class="h-icon-search"></i></Search>
            </div>
          </form>
        </div>
      </div>
    </nav>

    
  </div>
</template>

<script>
// 完成注册登录功能

export default {
  data() {
    return {
      dingimg: "",
      sinaimg: "",
    };
  },
 
  mounted() {
    this.sinaimg = config['staticurl'] + "sina.png";
    this.dingimg = config['staticurl'] + "dingding.png";
    
  },
  methods: {
    
  }
}
</script>

<style>
@font-face {
  font-family: "lantingxihei";
  src: url("/static/fonts/FZLTCXHJW.TTF");
}

/* modal 模态框*/
#invite-user .modal-body {
  overflow: hidden;
}
#invite-user .modal-body .form-label {
  margin-bottom: 16px;
  font-size: 14px;
}
#invite-user .modal-body .form-invite {
  width: 80%;
  padding: 6px 12px;
  background-color: #eeeeee;
  border: 1px solid #cccccc;
  border-radius: 5px;
  float: left;
  margin-right: 10px;
}
#invite-user .modal-body .msg-modal-style {
  background-color: #7dd383;
  margin-top: 10px;
  padding: 6px 0;
  text-align: center;
  width: 100%;
}
#invite-user .modal-body .modal-flash {
  position: absolute;
  top: 53px;
  right: 74px;
  z-index: 999;
}
/* end modal */

.en-footer {
  padding: 30px;
  text-align: center;
  font-size: 14px;
}
.navbar-banner {
  margin-top: 50px;
  background: url("/static/img/homepage-bg.png");
  background-size: cover;
  background-repeat: no-repeat;
}
</style>
